<#include 'global.ftl'>

<#macro header title>
<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>${title!''}</title>
  <link href="${cssRoot}/demo.css" rel="stylesheet">
  <#nested>
</head>
<body>
</#macro>

<#macro body navActived pageHeader>
<#include 'header.ftl'>
<div class="container">
  <#-- <div class="row"> -->
    <#-- <#include 'sidebar.ftl'> -->
    <#-- <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main"> -->
      <h1 class="page-header">${pageHeader!''}</h1>
      <#nested>
      <#if demos??>
      <#list demos as demo>
        <div class="demo"><a name="${demo.n}"></a>
          <#-- <h3><i>${demo_index + 1}.</i> ${demo.n} <small>(default: ${demo.d})</small></h3> -->
          <#-- <p>${demo.s}</p> -->
          <p>${demo.e!''}</p>
          <#list demo.c as democ>
          <button class="btn btn-default">运行代码</button>
          <pre contenteditable><code>${democ}</code></pre>
          </#list>
        </div>
      </#list>
      </#if>
      <#include 'footer.ftl'>
    <#-- </div> -->
  <#-- </div> -->
</div>
</#macro>

<#macro footer>
  <script src="${jsRoot}/jquery.js"></script>
  <script src="${jsRoot}/bootstrap.js"></script>
  <script src="${jsRoot}/sea.js"></script>
  <script src="${jsRoot}/seajs-text.js"></script>
  <script src="${jsRoot}/seajs-style.js"></script>
  <#-- <script src="${jsRoot}/seajs-debug.js"></script> -->
  <script>
  window.GLOBAL = {
    CTX: '${ctx}',
    CHANNEL_ID: '${channelId}',
    CHANNEL_NAME: '${channelName}',
    USER_CODE: '${userCode}',
    USER_NAME: '${userName}',
    GAME_CODE: '${gameCode}'
  };
  <#if DEBUG?? && DEBUG>
    seajs.config({
      base: '${ctx}${fed}/sea-modules/',
      paths: {
        'common': '${appRoot}/common/',
        'component': '${appRoot}/component/',
        'tinymce': '${appRoot}/common/editor/tinymce'
      },
      map: [
        // ['${ctx}${fed}/sea-modules/jquery/jquery', '${jsRoot}/jquery']

        //[/(\/sea\-modules\/[^(\-debug)]+?)\.js/, '$1-debug.js']
        function(uri) {
          if (!/\-debug\.(js|css)+/g.test(uri) && uri.indexOf('/app/') == -1) {
              uri = uri.replace(/\/(.*)\.(js|css)/g, "/$1-debug.$2")
          }
          return uri
        }
      ],

    alias: {
      '$':          'jquery/jquery/2.1.0/jquery',
      '$-debug':    'jquery/jquery/2.1.0/jquery-debug',
      'jquery':          'jquery/jquery/2.1.0/jquery',
      'jquery-debug':    'jquery/jquery/2.1.0/jquery-debug',
      'alert':      'pandora/dialog/1.0.0/alert',
      'autorender':     'pandora/widget/1.0.0/autorender',
      'base':      'pandora/base/1.0.0/base',
      'class':      'pandora/class/1.0.0/class',
      'widget':     'pandora/widget/1.0.0/widget',
      'confirm':    'pandora/dialog/1.0.0/confirm',
      'dialog':     'pandora/dialog/1.0.0/dialog',
      // 'draggable':  'pandora/dragdrop/1.0.0/draggable',
      'locker':     'pandora/locker/1.0.0/locker',
      'overlay':     'pandora/overlay/1.0.0/overlay',
      'switchable':       'pandora/switchable/1.0.0/switchable',
      'tabs':       'pandora/tabs/1.0.0/tabs',
      'select':       'pandora/select/1.0.0/select',
      'tips':       'pandora/dialog/1.0.0/tips',
      'validate':   'pandora/validate/1.0.0/validate',

      'bootstrap3-grid': 'jquery/bootstrap3-grid/0.6.2/bootstrap3-grid',
      "daterangepicker": "jquery/daterangepicker/1.3.8/daterangepicker",
      "popover": "jquery/popover/3.1.1/popover",
      "tooltip": "jquery/tooltip/3.1.1/tooltip",

      'moment':     'gallery/moment/2.5.1/moment',
      'zeroclipboard': 'gallery/zeroclipboard/1.2.2/zeroclipboard',
      'store':     'gallery/store/1.3.16/store',
      'handlebars': 'gallery/handlebars/1.0.2/handlebars',
      'handlebars-helpers': 'gallery/handlebars-helpers/1.3.0/handlebars-helpers',
      'ztree': 'gallery/ztree/3.5.15/ztree'
    }
    });
  <#else>
    seajs.config({
      base: '${jsRoot}'
    });
  </#if>
  </script>
  <#nested>

</body>
</html>
</#macro>
